<template>
  <el-menu
    :default-active="currentpath"
    class="el-menu-vertical-demo"
    @open="handleOpen"
    @close="handleClose"
    background-color="#545c64"
    text-color="#fff"
    active-text-color="#ffd04b"
    router
    :unique-opened="true"
   
  >
    <template v-for="(menu,i) in menus">
      <template v-if="userinfo.roleid==menu.premession||menu.premession==-1">
          <el-menu-item  :key="i" :index="menu.path">
            <i :class="menu.icon"></i>
            <span slot="title">{{menu.text}}</span>
          </el-menu-item>
      </template>
      <template v-else>
          
      </template>
      
    </template>
    
  </el-menu>
</template>


<script>
import { menus } from "@/utils/menus";

export default {
  props: ["userinfo"],
  data() {
    return {
      // roleid:sessionStorage.getItem("roleid"),
      menus,
      currentpath: this.$route.path,
      // roleid:sessionStorage.getItem("roleid")
    };
  },
  watch: {
    $route: function (to, from) {
      this.currentpath = to.path;
    },
  },
  methods: {
    handleOpen() {},
    handleClose() {},
  },
  mounted(){
   this.$forceUpdate()
    // consoisle.log(this.userinfo)
  }
};
</script>
